<template>
  <div class="content">
    <Card>
      <div class="title">
        更新记录
      </div>
      <div class="text">
        <div v-for="item in updateArr" :key="item._id" class="update-content">
          <div class="update-content-date">
            日期：{{ item.date }}
          </div>
          <div v-for="(i,index) in item.updateContent" :key="index" class="update-content-major">
            *{{ i }}！
          </div>
          <div v-for="(i,index) in item.bugfix" :key="index" class="update-content-bugfix">
            {{ index+1 }}. {{ i }}
          </div>
        </div>
      </div>
    </Card>
  </div>
</template>
<script lang="ts" setup>
import Card from '@/components/Card/Card.vue';
import { ref } from 'vue'
import { getUpdate } from '@/https/api'

interface updateArr {
  _id: string,
  bugfix: [string],
  date: string,
  updateContent: [string]
}
let updateArr = ref<[updateArr]>()
getUpdate().then((res) => {
  updateArr.value = res.data
})
</script>
<style scoped lang="scss">
.content {
  padding: 0px 10px
}

.update-content{
  margin-top: 10px;
  border-left: 2px solid $theme-color;
  line-height: $info-line-height;
  &-major{
    color: $theme-color;
  }
  &-date{
    border-left: 5px solid $theme-color;
  }
  &-bugfix{
    color:$theme-color-info
  }
}
</style>